<template>
    <label class="h50 white-bg px12 f16 m-group-item" flex :class="{tap: !isLink}" @click="onClick">
        <span v-if="required" class="c1">*</span>
        <slot name="left">
            <i class="iconfont mr6 text2 f20" :class="icon" v-if="icon"></i>
            <slot name="label">
                <span class="label" :style="{'min-width': $parent.labelWidth_}">{{label}}</span>
            </slot>
        </slot>
        <span flex-box="1" class="rel" :style="{'text-align': $parent.align}"><slot></slot></span>
        <slot name="right"></slot>
        <i class="iconfont icon-youjiantou2 f18 text3" v-if="!isLink"></i>
    </label>
</template>
<script>
  export default {
    props: {
      label: null,
      isLink: {
        default: true
      },
      link: {
        type: Object
      },
      icon: null,
      required: null
    },
    data () {
      return {
      }
    },
    computed: {},
    methods: {
      onClick () {
        if (!this.link) return
        this.$router.push(JSON.parse(JSON.stringify(this.link)))
      }
    },
    components: {}
  }
</script>
<style type="text/scss" lang="scss" scoped>

</style>
